

var ulbox = document.querySelector(".ulbox")
var libox = [];
var list = document.querySelector(".list")
var divbox = []
const xhr1 = new XMLHttpRequest();
xhr1.open("get","http://chst.vip:1234/api/getbrandtitle",false);

xhr1.onload = function(){
    let res1 = JSON.parse(xhr1.responseText)
    console.log(res1.result);
    let ele1 = "";
    res1.result.forEach(item1 => {
        libox.push(item1.brandTitleId)
        ele1 += `<li brandTitleId="${item1.brandTitleId}">
                    <a href="">${item1.brandTitle}
                        <span>▼</span>
                    </a>
                    <div></div>
                </li>`
    });
    ulbox.innerHTML = ele1
}
xhr1.send();

console.log(libox);
libox.forEach(value=>{
    const xhr2 = new XMLHttpRequest();
    xhr2.open("get","http://chst.vip:1234/api/getbrand?brandtitleid="+value,false);    
    xhr2.onload = function(){
        let res2 = JSON.parse(xhr2.responseText)
        //console.log(res2.result);
        let ele2 = "";
        res2.result.forEach(item2=>{
            ele2 += `<div class="list" brandTitleId="${item2.brandTitleId}">
                        <a href="">
                            <div class="title">
                                <i>1</i>
                                <p>${item2.brandName}</p>
                            </div>
                            <span class="one">${item2.brandInfo}</span>
                        </a>
                    </div>`
        })
        divbox.push(ele2);
        ele2 = "";
    }
    xhr2.send();
})
console.log(divbox);


// 获取到 每个 div 给 div中 写入 存在数组中的 内容
let aDiv = document.querySelectorAll(".ulbox li div")
console.log(aDiv);
aDiv.forEach((item,index)=>{
    console.log(item)
    console.log(divbox[index])
    item.innerHTML = divbox[index];
});

//抽屉效果
$('.ulbox li').click(function(){
    $(this).find('div').slideToggle().parent().siblings().find('div').slideUp();
})
